.adds-area .container-fluid,.instragam-area .container-fluid {
  display: block;
  overflow: hidden;
  padding: 0;
}
.single-adds,.middle-single{
  position:relative;
  display:block;
  overflow:hidden;
}
.middle-single {
  width: 100%;
}
.adds-content,.middle-content {
  left: 50px;
  position: absolute;
  top: 42px;
  width: 100%;
  z-index:99999;
  opacity:0;
  transition:.4s;
  visibility:hidden;
}
.single-adds:hover .adds-content{opacity:1;visibility:visible;}
.middle-single:hover .middle-content{opacity:1;visibility:visible;}
.adds-content > h3 {
  color: #444444;
  font-family: open sans;
  font-size: 40pt;
  font-weight: 700;
  line-height: 90px;
}
.single-adds:hover .adds-content > h3{color:#fff;}
.adds-content h2 {
  color: #8bc34a;
  font-family: open sans;
  font-size: 50pt;
  font-weight: 700;
  margin: 0 0 70px;
}
.adds-content > a {
  background: #8bc34a none repeat scroll 0 0;
  color: #fff;
  font-weight: 700;
  padding: 10px 45px 10px 30px;
  transition:.4s;
}
.adds-content > a:hover {
  background: #444444 none repeat scroll 0 0;
}
.offer-box {
  background: #e9ebee none repeat scroll 0 0;
  border-radius: 100%;
  display: block;
  height: 200px;
  margin: 60px auto 0;
  overflow: hidden;
  padding: 52px 0;
  width: 200px;
}
.offer-box h3 {
  color: #8bc34a;
  font-size: 44pt;
  font-weight: 700;
  line-height: 55px;
  margin: 0;
  font-family: open sans;
}
.offer-box span {
  font-size: 26pt;
  color: #8bc34a;
  font-weight: 700;
  text-transform:lowercase;
}
.adds-middle {
  display: block;
  float: left;
  overflow: hidden;
}
.middle-content > h1 {
  color: #444444;
  font-size: 40pt;
  font-weight: 700;
  margin: 0 0 25px;
  text-transform: uppercase;
  font-family: open sans;
}
.middle-single:hover .middle-content > h1,.middle-single:hover .middle-content > h3{color:#fff;}
.middle-content > h2 {
  color: #8bc34a;
  font-family: open sans;
  font-size: 50pt;
  font-weight: 700;
}
.middle-content > h3 {
  color: #444444;
  display: block;
  font-family: open sans;
  font-size: 40pt;
  font-weight: 700;
  line-height: 85px;
  overflow: hidden;
  text-transform: uppercase;
}
.adds-content a span {
  font-size: 20px;
  line-height: 15px;
  margin-left: 5px;
  margin-top: 0;
  position: absolute;
  transition:.3s;
}
.adds-content a:hover span {
  margin-left: 2px;
}
.single-adds,.middle-single {
  display: block;
  position: relative;
  transition: all 0.3s ease 0s;
}
.single-adds::before,.middle-single::before {
  background-color: #000;
  bottom: 15px;
  content: "";
  left: 15px;
  opacity: 0;
  position: absolute;
  right: 15px;
  top: 15px;
  transition: all 0.3s ease 0s;
  transform:scale(0);
}
.single-adds:hover::before,.middle-single:hover::before {
  opacity: 0.4;
  transform:scale(1);
}
@media (min-width: 1200px){
.mb-30 {
    margin-bottom: 30px;
}

}
@media (min-width: 992px) and (max-width: 1199px){
  .mb-30 {
    margin-bottom: 16px;
}
}
@media (max-width: 767px){
  .single-adds{
    margin-bottom: 20px;
  }
}
